<template>
	<view class="report-bc">
		<uv-radio-group v-model="radiovalue">
			<view class="report-item" v-for="typ in reportTypes">
				<view class="report-title">
					{{typ}}
				</view>
				<uv-radio :customStyle="{margin: '8px'}" v-for="item in reportDatas.filter(x=>x.description == typ)"
					:label="item.name" :name="item.id">
				</uv-radio>
			</view>

		</uv-radio-group>
		<view class="report-next">
			<uv-button type="error" color="#f35344" :disabled="!radiovalue" text="下一步" @click="toReportSubmit"></uv-button>
		</view>
	</view>
	
</template>

<script setup>
	import api from './api';
	import {
		ref,
		onMounted
	} from 'vue'
	const id = ref('')
	onMounted(() => {
		let pages = getCurrentPages(); // 获取当前打开过的页面路由数组
		id.value = pages[pages.length - 1].options.id; // 获取当前页面栈的实例
		console.log('作品id:', id.value);
		getReportType()
	})
	//类型列表
	const reportDatas = ref([])
	const reportTypes = ['违反法律法规', '谣言及不实信息', '投稿不规范', '不友善行为', '违反公序良俗']
	// 获取举报类型
	const getReportType = () => {
		api.getReportType().then(res => {
			reportDatas.value = res.datas
			console.log('举报类型', res.datas)
		})
	}
	
	const radiovalue = ref('')
	
	const toReportSubmit = ()=>{
		uni.navigateTo({
			url:'/pages/report/reportSubmit?id='+id.value+'&type='+radiovalue.value
		})
	}
</script>

<style lang="scss">
	.report-bc{
		padding: 40rpx;
		padding-bottom: 150rpx;
		position: relative;
		.report-item{
			width: 80%;
		}
		.report-next{
			width: 90%;
			    position: absolute;
			    left: 5%;
			    bottom: 60rpx;
		}
	}
</style>